import React, { Component } from "react";
import { connect } from "react-redux";

import { minusAction, addAction } from "./store/actionCreator";

const mapStateToProps = (state) => {
  return {
    count: state.count,
  };
};

const mapDispatchToProps = (dispatch) => {
  return {
    add(num) {
      dispatch(addAction(num));
    },
    minus() {
      dispatch(minusAction());
    },
  };
};

@connect(mapStateToProps, mapDispatchToProps)
class Count extends Component {
  render() {
    return (
      <>
        <button onClick={this.props.minus}>-</button>
        <span>{this.props.count}</span>
        <button onClick={() => this.props.add(2)}>+</button>
      </>
    );
  }
}

// export default connect(mapStateToProps, mapDispatchToProps)(Count);
export default Count;
